<template>
	<view @click="goToBook" class="flex" style="height: 100%;">
		<!-- 封面 -->
		<view style="width: 250rpx;margin-right:40rpx;">
			<image :src="book.cover" mode="aspectFit" style="height: 280rpx;width: 250rpx;"></image>
		</view>
		<!-- 书籍、期刊基本信息 -->
		<view class="flex flex-direction justify-between" style="height: 280rpx;font-size: 28rpx;overflow: hidden;">
			<view class="flex flex-direction">
				<!-- 题目、书名 -->
				<text style="font-weight: bold;color: #333333;">{{book.title}}</text>
				<!-- 描述信息 -->
				<text style="word-break:break-all;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;color: #666666;">
					{{book.description}}
				</text>
			</view>
			<!-- 相关统计信息 -->
			<text style="font-size: 20rpx;color: #666666;">播放量：{{book.viewCount}}</text>
		</view>
		
	</view>
</template>

<script>
	export default{
		props:{
			book:{
				type:Object
			}
		},
		methods: {
			goToBook(){
				this.$Router.push({
					name:'bookDetail',
					params:{
						id: this.book.contentId,
					},
				});
			}
		}
	}
</script>

<style lang="scss">
</style>
